<template>
  <div class="app-container">
    <el-card class="box-card" :key="key">
      <div slot="header" class="clearfix">
        <span>{{id ? '编辑项目': '新建项目'}}</span>
      </div>
      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="120px" class="form">
        <el-form-item label="项目类型">
          <el-radio-group v-model="form.proTypeId" :disabled="status || $route.params.id?true:false" style="padding-top: 10px;">
            <el-radio v-for="(item,index) of typeList" @change="allFn()" :key="index" :label="item.typeId" style="position: relative; height: 30px" @mouseover.native="typeflag=index" @mouseout.native="typeflag=-1">
              <span  class="radio">
                  {{item.typeName}}
              </span>
               <div  v-show="index==typeflag" class="radioPosition"  >
                 {{item.typeName}}
               </div>
            </el-radio>
          </el-radio-group>

        </el-form-item>

              <el-form-item label="项目节点" style="margin-top: -20px">
                  <el-row style="margin-top: 5px" type="flex">
                      <div style="overflow-x: auto;display: flex;width: 1200px">
                      <my_stepbox
                              v-for="(item,index) of nodeTypeList"
                              :active="index==0?false:true"
                              :key="index"
                              :index="item.nodeId"
                              :inputValue="item.nodeName"
                              @handleClose="abc">
                      </my_stepbox>
                      </div>
                  </el-row>
              </el-form-item>


        <el-row>
          <el-col :span="8">
            <el-form-item label="项目编号" prop="">
              <el-input v-model="form.proCode" placeholder="生成，不可编辑" disabled='disabled'></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="合同编号" >
              <el-input
                  v-model.trim="form.contractCode"
                  placeholder="请输入合同编号"
                  maxLength="50">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="项目名称" prop="proName">
              <el-input
                  v-model.trim="form.proName"
                  placeholder="请输入项目名称"
                  maxLength="200">
              </el-input>
            </el-form-item>
          </el-col>

          <el-col :span="14">
            <el-form-item label='项目优先级' prop="proPriority">
              <el-radio-group v-model="form.proPriority">
                <el-radio :label="1">高</el-radio>
                <el-radio :label="2">中</el-radio>
                <el-radio :label="3">低</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="归属分社" prop="branchIds" required>
              <el-select @change="getBranchContact(1)" v-model="form.branchIds" style="width: 100%" multiple placeholder="请选择归属分社">
                <el-option v-for="(item) of branchList" :key="item.branchId" :label="item.branchName"
                           style="width: 260px"
                           :title="item.branchName"
                           :value="item.branchId"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="分社对接人" prop="branchContactIds">
              <el-select style="width: 100%" v-model="form.branchContactIds" placeholder="请选择分社对接人" multiple  @change="canChose">
                <el-option
                  v-for="item in  branchIdConcatList"
                  :key="item.contactId"
                  :label="item.contactName"
                  style="width: 260px"
                  :title="item.contactName"
                  :value="item.contactId">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="项目概述" prop="proSummary">
          <el-input v-model.trim="form.proSummary" type="textarea" maxlength="500" show-word-limit :autosize="{ minRows: 5}"
                    resize="none"/>
        </el-form-item>
        <el-form-item label="项目公告">
          <el-input v-model.trim="form.proNotice" type="textarea" maxlength="500" show-word-limit :autosize="{ minRows: 5}"
                    resize="none"/>
        </el-form-item>
        <el-form-item label="项目资料">
          <div class="datum">
              <div style="width: 150%">
                <el-form-item v-for="(domain, index) in form.domains" :key="index" style="marginBottom:18px">
                    <el-row :gutter="10">
                      <el-col :span="5"  >
                        <el-form-item :prop="`domains.${index}.nodeType`" :rules="domainsRules(index) ? [{required: false}] : rules.nodeType">
                          <el-select placeholder="选择项目节点"v-model="domain.nodeType"
                                     style="width: 100%">
                            <el-option v-for="(item,index) of nodeTypeList"
                                       style="width: 260px"
                                       :key="index"
                                       :title="item.nodeName"
                                       :label="item.nodeName"
                                       :value="item.nodeId"/>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="5" >
                        <el-form-item :prop="`domains.${index}.data`" :rules="domainsRules(index) ? [{required: false}] : rules.data">
                          <el-select v-model="domain.data" placeholder="选择资料"  @change="getMustFlag(domain,index)" style="width: 100%">
                            <el-option v-for="(item,index) in dataList"
                                       style="width: 260px"
                                       :title="item.dataName"
                                       :key="index"
                                       :label="item.dataName"
                                       :value="item.dataId"/>
                          </el-select>
                        </el-form-item>
                      </el-col>
                      <el-col :span="4" >
                        <el-select v-model="domain.isdata" placeholder="是否必须" disabled = disabled>
                          <el-option label="是" :value="1"/>
                          <el-option label="否" :value="0"/>
                        </el-select>
                      </el-col>
                      <el-col :span="6"  >
                        <el-form-item :prop="`domains.${index}.address`" :rules="domain.isdata == '1' ? rules.address : [{ required: false }]">
                          <el-input placeholder="请输入资料Git地址" class="datumInput" v-model.trim="domain.address" maxLength="500"></el-input>
                        </el-form-item>
                      </el-col>
                      <el-col :span="3" >
                        <el-button @click.prevent="removeDomain(domain)" v-show="form.deleteDelBtn" class="deleteDelBtn"> 删除</el-button>
                      </el-col>
                    </el-row>
                </el-form-item>
              </div>
            <el-form-item>
              <el-button @click="addDomain" >添加</el-button>
            </el-form-item>
          </div>
        </el-form-item>
          <el-row type="flex" justify="start" :gutter="20">
            <el-col  style="width: 455px">
              <el-form-item label="项目周期" prop="date" required
                            :rules="[ {required: true,message: '请先择项目周期', trigger: 'blur'}]">
                <el-date-picker
                  :disabled="status"
                  v-model="form.date"
                  type="daterange"
                  :clearable="false"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  :picker-options="pickerOptions">
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col  :span="8">
              <el-form-item label="归属研发部门" prop="deptId" style="margin-left: 30px">
                <el-select v-model="form.deptId" style="width: 200px" placeholder="请选择归属研发部门" >
                  <el-option v-for="(item,index) of deptList" :key="index" :label="item.deptName" :value="item.deptId" style="width: 200px"/>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>

        <el-form-item label="节点周期" >
          <el-row>
            <div style="margin-bottom: 20px" class="nodeCycleList nodes" v-for="(i, index) in form.nodeTypeTimeList"
                 :key="index">
              <el-form-item :label="i.nodeName" :prop="'nodeTypeTimeList.' + index + '.time'" :rules="rules.time" >
                <el-date-picker
                  @change="nodeTypeTimeChange(index)"
                  :disabled="status"
                  v-model="i.time"
                  type="daterange"
                  :picker-options="pickerOptionsNodes[`${index}`]"
                  :clearable="false"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>
            </div>
          </el-row>
        </el-form-item>




        <el-form-item label="流转项目负责人" prop="managerName">
          <UserList  :id="form.proManager"  :name="form.proManagerName" style="width: 355px" :status="status" @handleChose="userChose"/>
        </el-form-item>
        <el-form-item>
          <div class="buttonBox">
            <el-button :type="saveLoading?'info':'primary'" :loading="saveLoading" @click="onSubmit('ruleForm')">保存</el-button>
            <el-button v-if="this.id != null && this.id != ''" :type="submitLoading?'info':'primary'" :loading="submitLoading" @click="dingdingFn(1,'ruleForm')">提交</el-button>
          </div>
        </el-form-item>
      </el-form>
      <el-dialog
        :visible.sync="dialogVisible2"
        width="30%"
      >
        <span>需要提交到钉钉审批吗?</span>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dingdingFn(null,'ruleForm')">取 消</el-button>
          <el-button type="primary" @click="dingdingFn(1,'ruleForm')">确 定</el-button>
        </span>
      </el-dialog>
    </el-card>
  </div>

</template>

<script>
    import my_stepbox from '@/components/StepBox/index'
    import UserList from '@/components/userList/index'
    import moment from 'moment'
    import {
        http_createObject_deptList,
        http_createObject_branchContact,
        http_createObject_base,
        http_createObject_nodeType,
        http_createObject_code,
        http_createObject_save,
        http_createObject_editProjectInit,
        http_createObject_update,
        http_createObject_dingding
    } from '@/api/createObject'
    import {Message} from "element-ui";


    export default {
        components: {
            UserList,
            my_stepbox
        },
        data() {
            var validate = (rule, value, callback) => {
                if (!value) {
                    return callback(new Error('请选择日期'))
                } else {
                    callback()
                }
            }
            var valiNodeDate = (rule, value, callback) => {
                if (!value) {
                    return callback(new Error('请选择日期'))
                } else if (this.form.date.length == 0) {
                    this.form.nodeTypeTimeList[this.flag].time = ''
                    this.$message('请先选择项目周期')
                } else if (this.form.date[0] > value[0]) {
                    this.form.nodeTypeTimeList[this.flag].time = ''
                    this.$message('节点周期开始时间必须大于项目开始时间')
                } else if (this.form.date[1] < value[1]) {
                    this.form.nodeTypeTimeList[this.flag].time = ''
                    this.$message('节点周期结束时间必须小于项目结束时间')
                }
                this.form.nodeTypeTimeList.reduce((val, item, index) => {
                    if (index>0&&val >= item.time[0]) {
                        this.form.nodeTypeTimeList[this.flag].time = ''
                        this.$message('节点周期时间不可以重叠')
                    }
                    return (item.time[1])
                }, new Date(this.form.date[0]))
                return callback()
            }

            return {
                saveLoading: false,
                submitLoading: false,
                nodeTimeKey: new Date().getTime(),
                flag:1,
                dialogVisible2: false,
                subShow: false,
                // 单前项目状态 fasle：待审批全部可以修改, 1:审批中则项目编号，项目周期，节点周期，流转项目负责人不可修改。
                status: false,
                // true： 新建页面 ，false：编辑页面
                path: true,
                rules: {
                    proName: [
                        {required: true, message: '请输入项目名称', trigger: 'blur'},
                        {max: 200, message: '最长200字符', trigger: 'blur' }
                    ],
                    proSummary: [
                        {required: true, message: '请输入项目概述', trigger: 'blur'}
                    ],
                    nodeType: [
                        {required: true, message: '请选择项目节点', trigger: 'change'}
                    ],
                    data: [
                        {required: true, message: '请选择项目资料', trigger: 'change'}
                    ],
                    address: [
                        {required: true, message: '请输入资料Git地址', trigger: 'blur'},
                        {max: 500, message: '最长500字符', trigger: 'blur'}
                    ],
                    date: [
                        {required: true,message: '请先择项目周期', trigger: 'blur', validator: validate}
                    ],
                    time: [
                        {required: true, trigger: 'change', validator: valiNodeDate}
                    ],
                    branchContactIds: [
                        {required: true, message: '请选择分社对接人', trigger: 'change'}
                    ],
                    managerName: [
                        {required: true, message: '请选择负责人', trigger: ['blur','change']}
                    ],
                    branchIds:[
                        {required: true, message: '请选择归属分社', trigger: 'change'}
                    ],
                    proPriority:[
                        {required: true, message: '请选择优先级', trigger: 'change'}
                    ],
                    branchId:[
                        {required: true, message: '请选择分社', trigger: 'change'}
                    ],
                    deptId:[
                        {required: true, message: '请选择归属部门', trigger: 'change'}
                    ]
                },
                centerDialogVisible: false,
                defaultDate: [],
                form: {

                    proName: '',
                    // 合同编号
                    contractCode: '',
                    // 项目概述
                    proSummary: '',
                    // 项目公共
                    proNotice: '',
                    // 项目周期时间
                    date: '',
                    // 节点周期时间列表
                    nodeTypeTimeList: [],
                    // 项目类型
                    proTypeId: '',
                    // 项目编码
                    proCode: '',
                    // 项目优先级
                    proPriority: 1,
                    // 归属分社
                    branchId: '',
                    branchIds: [],
                    contact: 1,
                    // 分社对接人
                    branchContactIds: [],
                    // 删除按钮
                    deleteDelBtn: true,
                    // 查找负责人
                    responsible: '',
                    // 项目资料列表
                    domains: [{
                        nodeType: '',
                        data: '',
                        isdata: '',
                        address: ''
                    }],
                    nodeCycle: [{
                        value: ''
                    }],
                    // 归属部门Id
                    deptId: '',
                    projectNodeSelect: [{
                        name: ''
                    }],
                    projectNode: [],
                    managerName:''
                },
                dataNodeTypeIs: true,
                timeNodeTypeIs: true,
                //项目类型列表
                typeList: [],
                // 项目节点列表
                nodeTypeList: [],
                // 归属分社列表
                branchList: [],
                // 归属分社对接人列表
                branchIdConcatList: [],
                // 项目资料类型
                dataList: [],
                // 归属部门列表
                deptList: [],
                // 流转项目负责人列表
                userList: [],
                userPageSize: 10,
                usertotal: 0,
                userPageCurrent: 0,
                saveFlag: false,
                // 保存返回的id
                id: '',
                typeflag:-1,

                pickerOptions: { // 限制收货时间不让选择今天以前的
                    disabledDate(time) {
                        return time.getTime() < Date.now() - 24 * 60 * 60 * 1000
                    }
                },
                pickerOptionsNodes: {},// 限制收货时间不让选择今天以前的
                key: new Date().getTime()

            }
        },
        watch:{
            'form.date': {
                handler(date,oldDate){
                    // console.log("date: ",date)
                    // console.log("this.form.nodeTypeTimeList: ",this.form.nodeTypeTimeList)
                    let {nodeTypeTimeList} = this.form;
                    // 清理不在范围内的节点周期
                    nodeTypeTimeList.forEach((n,i)=>{
                        if (n.time != null && n.time.length != 0){
                            if (new Date(date[0]) > new Date(n.time[0]) || new Date(date[0]) > new Date(n.time[1]) ) n.time = ''
                            if (new Date(date[1]) < new Date(n.time[0]) || new Date(date[1]) < new Date(n.time[1]) ) n.time = ''
                        }
                    })
                    // 设定节点周期不可用日期段
                    nodeTypeTimeList.forEach((nodeTypeTime,index)=>{
                        let before = this.cycleNodeTypeTime(nodeTypeTimeList,index,0,date)
                        let after = this.cycleNodeTypeTime(nodeTypeTimeList,index,1,date)
                        // console.log(index,before,after)
                        const s = 24 * 60 * 60 * 1000
                        this.pickerOptionsNodes[`${index}`]={
                            disabledDate(time) {
                                return (
                                    time.getTime() < Date.now() - s ||   // 小于等于  今天
                                    time.getTime() <  before ||
                                    time.getTime() >  after // 每个节点型对于前后节点
                                )
                            }
                        }
                    })

                },
                deep:true
            },
            'form.nodeTypeTimeList':{
                handler(nodeTypeTimeList,oldNodeTypeTimeList){
                    // console.log("nodeTypeTimeList:",nodeTypeTimeList)
                    let {date} = this.form;

                    nodeTypeTimeList.forEach((n,i)=>{
                        let before = this.cycleNodeTypeTime(nodeTypeTimeList,i,0,date)
                        let after = this.cycleNodeTypeTime(nodeTypeTimeList,i,1,date)
                        const s = 24 * 60 * 60 * 1000
                        // console.log("i: ",i)
                        // console.log(i,"before: ",before)
                        // console.log(i,"after: ",after)
                        this.pickerOptionsNodes[`${i}`]={
                            disabledDate(time) {
                                return (
                                        time.getTime() < Date.now() - s ||   // 小于等于  今天
                                        time.getTime() <  before ||
                                        time.getTime() >  after // 每个节点型对于前后节点
                                )
                            }
                        }
                    })
                },
                deep:true
            },
            branchIdConcatList: function (branchIdConcatList,oldBranchIdConcatList){
                // console.log('xin',JSON.stringify(branchIdConcatList))
                let result = []
                this.branchIdConcatList.forEach(c=>{
                    this.form.branchContactIds.forEach((b)=>{
                        if (c.contactId == b){
                            result.push(b)
                        }
                    })
                })
                // console.log("result:",result)
                this.form.branchContactIds = result
            }


        },
        mounted() {

            if (this.$route.params.id) {
                this.id = this.$route.params.id
            } else {
                this.path = true
            }
            // 编辑页面和创建页面开关
            if(this.$route.params.id){
                this.path = false
            }
            this.getInit()
            if (!this.path) {
                this.getEditProjectInit()
            }
        },
        methods: {
            cycleNodeTypeTime(nodeTypeTimeList,index,type,date){
                const s = 24*60*60*1000
                if (type == 0){
                    // 获取index 前节点的最大日期
                    let times = []
                    nodeTypeTimeList.forEach((n,i)=>{
                        if(i < index){
                            if (n.time != null && n.time.length != 0 ){
                                times.push(n.time[0])
                                times.push(n.time[1])
                            }
                        }
                    })
                    let date0 = new Date(new Date(date[0]).toLocaleDateString())
                    let time0 = new Date(new Date(new Date(Math.max.apply(null,times)).getTime() + s).toLocaleDateString())
                    return (times.length == 0) ? date0 : time0
                }else {
                    // 获取index 后节点的最小日期
                    let times = []
                    nodeTypeTimeList.forEach((n,i)=>{
                        if(i > index){
                            if (n.time != null && n.time.length != 0 ){
                                times.push(n.time[0])
                                times.push(n.time[1])
                            }
                        }
                    })
                    let date1 = new Date(new Date(date[1]).toLocaleDateString())
                    let time1 = new Date(new Date(new Date(Math.min.apply(null,times)).getTime() - s).toLocaleDateString())
                    return (times.length == 0) ? date1 : time1
                }
            },
            nodeTypeTimeChange(index){
                this.flag = index
            },
            canChose(va){

            },
            domainsRules(index){
                let domain = this.form.domains[index]
                return (domain.nodeType == null || domain.nodeType == '' )&&
                        (domain.data == null || domain.data == '') &&
                        (domain.data == null || domain.address == '')
            },
            userChose(val){
                this.form.proManager = val.userId
                this.form.managerName = val.userName
                // 重置校验
                this.$nextTick(() => {
                    this.$refs['ruleForm'].clearValidate('managerName');
                })

            },
            getInit() {
                this.getBase()
                // 归属部门
                this.getDeptList()
            },
            // 编辑
            getEditProjectInit() {
                http_createObject_editProjectInit({id: this.$route.params.id}).then((res) => {
                    if (res.success) {
                        // this.form = res.data
                        for (var p in res.data) {
                            this.form[p] = res.data[p]
                        }

                        this.form.proTypeId = this.form.proTypeId + ''
                        this.form.branchContactIds = []
                        // 归属分社联系人

                        this.getBranchContact()

                        this.form.domains = []
                        // 项目资料
                        let d = this.form.domains
                        // console.log('proData',this.form.proData)

                        this.form.proData.forEach((item, index) => {
                            d.push({
                                nodeType: item.proNodeId,
                                data: item.proDataId,
                                address: item.gitAdr,
                                isdata: item.mustFlag
                            })
                        })
                        // console.log("domains:",this.form.domains)
                        // 编辑项目周期
                        var date = []
                        date.push(new Date(this.form.proStartDay))
                        date.push(new Date(this.form.proEndday))
                        this.$set(this.form, 'date', date)

                        this.allFn()
                    } else {
                        this.$message(res.message)
                    }
                })
            },

            // 获取项目初始化数据
            getBase() {
                http_createObject_base().then(res => {
                    if (res.success) {
                        // 项目类型
                        // console.log(res)
                        this.typeList = res.data.proTypeTOList
                        if (this.path) {
                            this.form.proTypeId = this.typeList[0].typeId
                        }
                        // 归属分社
                        this.branchList = res.data.branchTOList
                        if (this.branchList.length) {
                            if (this.path) {
                                this.form.branchId = this.branchList[0].branchId
                                this.getBranchContact()
                            }
                        }
                        // 项目资料
                        this.dataList = res.data.dataInfoTOList
                        if (this.dataList.length) {
                            // if (this.path) {
                            //     this.form.domains[0].data = this.dataList[0].dataId
                            // }
                        }
                        // 根据项目类型获取数据的所有接口
                        if (this.path) {
                            this.allFn()
                        }
                    } else {
                        this.$message(res.message)
                    }
                })
            },
            allFn() {
                // 项目节点

                //新增时 项目类型改变  页面内容清空
                let id = this.$route.params.id
                if (id == null){
                  this.form.contractCode = null
                  this.form.proName = null
                  this.form.branchIds = []
                  this.form.branchContactIds = []
                  this.form.proSummary = null
                  this.form.proNotice = null
                  // this.form.domains = []
                  this.form.date = []
                  this.form.domains=  [
                    {
                      "nodeType": "",
                      "data": "",
                      "isdata": "",
                      "address": ""
                    }
                  ]
                  this.form.deptId = ''
                  this.form.proManager = null
                  this.proManagerName = null
                }
                this.key = new Date().getTime()


                this.getNodeType()
                // 分社对接人
                this.form.branchContactIds = []
                // 项目编码
                if (this.path) {
                    this.getCode()
                }
            },
            // 根据类型获取项目初始节点
            getNodeType() {
                http_createObject_nodeType({typeId: this.form.proTypeId}).then((res) => {
                    if (res.success) {
                        this.nodeTypeList = res.data
                        if(this.path){
                            this.form.domains.length = 1
                        }
                        // console.log(this.form.domains)
                        this.form.nodeTypeTimeList = []
                        if (this.nodeTypeList.length) {
                            if (this.path) {
                                // this.form.domains[0].nodeType = this.nodeTypeList[0].nodeId
                            }
                            if (this.path) {
                                this.nodeTypeList.forEach((item, index) => {
                                    this.form.nodeTypeTimeList.push({
                                        nodeName: item.nodeName,
                                        nodeId: item.nodeId,
                                        time: ''
                                    })
                                })
                            } else {
                                // 编辑节点周期列表
                                // this.form.nodeTypeTimeList = []
                                var date = []
                                this.form.proNodeList.forEach((item, index) => {
                                    var time = []
                                    time.push(new Date(item.startDate))
                                    time.push(new Date(item.endDate))
                                    date.push({
                                        nodeName: this.nodeTypeList[index].nodeName,
                                        nodeId: item.proNodeId,
                                        time
                                    })
                                })
                                this.form.nodeTypeTimeList = date
                                // this.$set(this.form,"nodeTypeTimeList",date)

                            }
                        }
                    } else {
                        this.$message(res.message)
                    }
                })
            },
            // 获取项目编码
            getCode() {
                http_createObject_code({proTypeId: this.form.proTypeId}).then((res) => {
                    if (res.success) {
                        this.form.proCode = res.data.proCode
                    } else {
                        this.$message(res.message)
                    }
                })
            },
            // 获取分社对接人列表
            getBranchContact(val) {
                if ( this.form.branchIds != null && this.form.branchIds.length != 0) {
                    http_createObject_branchContact(this.form.branchIds).then((res) => {
                        if (res.success) {
                            this.branchIdConcatList = res.data
                            if (!this.path && !val) {
                                this.form.contactTOList.forEach((item, index) => {
                                    this.form.branchContactIds.push(item.contactId)
                                })
                            }
                        } else {
                            this.$message(res.message)
                        }
                    })
                }else {
                    this.branchIdConcatList = []
                }
            },
            // 获取归属部门管理列表
            getDeptList() {
                http_createObject_deptList().then((res) => {
                    if (res.success) {
                        this.deptList = res.data
                    } else {
                        this.$message(res.message)
                    }
                })
            },
            // 回调
            abc(val) {
                // console.log(val)
            },
            onSubmit(formName,proCode) {
                if (proCode != null){
                    this.form.proCode = proCode
                }
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        var ziLiao = this.form.domains
                        var jieDian = this.form.nodeTypeTimeList
                        var proData = []
                        var proNodeDate = []
                        // console.log(jieDian)
                        ziLiao.forEach((item, index) => {
                            proData.push({
                                proNodeId: item.nodeType,
                                proDataId: item.data,
                                gitAdr: item.address,
                                mustFlag: item.isdata
                            })
                        })
                        jieDian.forEach((item, index) => {
                            proNodeDate.push({
                                startDate: moment(item.time[0]).format('YYYY-MM-DD'),
                                endDate: moment(item.time[1]).format('YYYY-MM-DD'),
                                proNodeId: item.nodeId
                            })
                        })
                        var obj = {
                            // 项目节点
                            proNodeId: this.nodeTypeList.length ? this.nodeTypeList[0].nodeId : '',
                            // 归属分社联系人
                            branchContactIds: this.form.branchContactIds,
                            // 归属分社Id
                            branchId: this.form.branchId,
                            branchIds: this.form.branchIds,
                            // 合同编号
                            contractCode: this.form.contractCode,
                            // 部门id
                            deptId: this.form.deptId,
                            // 项目编号
                            proCode: this.form.proCode,
                            // 项目资料
                            proData,
                            // 项目结束日期
                            proEndday: this.form.date.length ? moment(this.form.date[1]).format('YYYY-MM-DD') : '',
                            // 项目开始日期
                            proStartDay: this.form.date.length ? moment(this.form.date[0]).format('YYYY-MM-DD') : '',
                            //项目负责人Id
                            proManager: this.form.proManager,
                            // 项目名称
                            proName: this.form.proName,
                            // 项目节点周期
                            proNodeDate,
                            // 项目公告
                            proNotice: this.form.proNotice,
                            // 项目优先级
                            proPriority: this.form.proPriority,
                            // 项目概述
                            proSummary: this.form.proSummary,
                            // 项目类型
                            proTypeId: this.form.proTypeId
                        }
                        this.saveLoading = true
                        if (this.path) {
                            // console.log("project:",obj)
                            if (this.id == null || this.id == '') {
                                http_createObject_save(obj).then((res) => {
                                    const {success } = res
                                    if (success) {
                                        this.subShow = true
                                        this.dialogVisible2 = true
                                        Message.success('保存成功')
                                        this.id = res.data.id
                                    } else {
                                        this.$message(res.message)
                                    }
                                    this.saveLoading = false
                                }).catch(error=>{
                                    if (error.stateCode == '1002'){
                                        this.againSubmit(formName,error.message,error.data)
                                    }
                                    this.saveLoading = false
                                })
                            }else {
                                obj.id = this.id
                                http_createObject_update(obj).then((res) => {
                                    if (res.success) {
                                        this.subShow = true
                                        if (this.saveFlag == false){
                                            Message.success('保存成功')
                                        }
                                        this.id = res.data.id
                                        this.subShow = true
                                        this.saveFlag = true
                                    } else {
                                        this.$message(res.message)
                                    }
                                    this.saveLoading = false
                                }).catch(error=>{this.saveLoading = false})
                            }
                        } else {
                            obj.id = this.$route.params.id
                            // console.log("obj",obj)
                            http_createObject_update(obj).then((res) => {
                                if (res.success) {
                                    this.subShow = true
                                    if (this.saveFlag == false){
                                        Message.success('保存成功')
                                    }
                                    this.id = res.data.id
                                    this.subShow = true
                                    this.saveFlag = true
                                } else {
                                    this.$message(res.message)
                                }
                                this.saveLoading = false
                            }).catch(error=>{this.saveLoading = false})
                        }

                    } else {
                        // console.log('error submit!!')
                        return false
                    }
                })
            },
            againSubmit(formName,message,proCode) {
                this.$confirm(`<b>${message}</b><br><div>项目编号:<span  style="color: red">${proCode}</span></div>`, '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    dangerouslyUseHTMLString: true,
                    type: 'warning'
                }).then(() => {
                    this.onSubmit(formName,proCode)
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消'
                    });
                });
            },
            onCancel() {
                this.$message({
                    message: 'cancel!',
                    type: 'warning'
                })
            },
            search() {

            },
            removeDomain(item) {
                if (this.form.domains.length > 1) {
                    this.deleteDelBtn = true
                    var index = this.form.domains.indexOf(item)
                    if (index !== -1) {
                        this.form.domains.splice(index, 1)
                    }
                } else {
                    this.deleteDelBtn = false
                }
                // console.log(this.form.domains)
            },
            // 项目资料添加
            addDomain() {
                var flag
                // var nodeType
                this.nodeTypeList.some((item, index) => {
                    flag = false
                    this.form.domains.forEach((it, ind) => {
                        if (item.nodeId == it.nodeType) {
                            flag = true
                        }
                    })
                    // if (!flag) {
                    //     nodeType = item.nodeId
                    //     return true
                    // }
                })
                // if (flag) {
                //     this.$message('暂无更多项目节点')
                //     return
                // } else {

                    if (this.dataList.length) {
                        // var data = this.dataList[0].dataId
                    }
                    this.form.domains.push({
                        nodeType:  '',
                        data:  '',
                        isdata: '',
                        address: ''
                    })

                // }
            },

            // 判断资料节点是否有重复选项
            dataNodeType(val, domains) {
                let num = 0
                this.$nextTick(() => {
                    this.form.domains.some((item, index) => {
                        if (item.nodeType == val) num++
                    })
                    if (num > 1) {
                        this.removeDomain(domains)
                        return this.$message('已有该项目节点')
                    }
                    // console.log(this.form.domains)
                })

            },

            dingdingFn(val,formName) {
                let subObj = this.getSubmitData(formName)
                // console.log("dingdingFn",subObj)
                if (val && this.id) {
                    this.submitLoading = true
                    http_createObject_dingding(this.form.proCode,subObj).then((res) => {
                        if (res.success) {
                            this.jump()
                        } else {
                            this.dialogVisible2 = false
                            this.$message(res.message)
                        }
                        this.submitLoading = false
                    }).catch(()=>{this.submitLoading = false})
                } else {
                    this.dialogVisible2 = false
                }

            },
            getSubmitData(formName) {
                let subObj
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        var ziLiao = this.form.domains
                        var jieDian = this.form.nodeTypeTimeList
                        var proData = []
                        var proNodeDate = []
                        // console.log(jieDian)
                        ziLiao.forEach((item, index) => {
                            proData.push({
                                proNodeId: item.nodeType,
                                proDataId: item.data,
                                gitAdr: item.address,
                                mustFlag: item.isdata
                            })
                        })
                        jieDian.forEach((item, index) => {
                            proNodeDate.push({
                                startDate: moment(item.time[0]).format('YYYY-MM-DD'),
                                endDate: moment(item.time[1]).format('YYYY-MM-DD'),
                                proNodeId: item.nodeId
                            })
                        })
                        var obj = {
                            id: this.id,
                            // 项目节点
                            proNodeId: this.nodeTypeList.length ? this.nodeTypeList[0].nodeId : '',
                            // 归属分社联系人
                            branchContactIds: this.form.branchContactIds,
                            // 归属分社Id
                            branchId: this.form.branchId,
                            branchIds: this.form.branchIds,
                            // 合同编号
                            contractCode: this.form.contractCode,
                            // 部门id
                            deptId: this.form.deptId,
                            // 项目编号
                            proCode: this.form.proCode,
                            // 项目资料
                            proData,
                            // 项目结束日期
                            proEndday: this.form.date.length ? moment(this.form.date[1]).format('YYYY-MM-DD') : '',
                            // 项目开始日期
                            proStartDay: this.form.date.length ? moment(this.form.date[0]).format('YYYY-MM-DD') : '',
                            //项目负责人Id
                            proManager: this.form.proManager,
                            // 项目名称
                            proName: this.form.proName,
                            // 项目节点周期
                            proNodeDate,
                            // 项目公告
                            proNotice: this.form.proNotice,
                            // 项目优先级
                            proPriority: this.form.proPriority,
                            // 项目概述
                            proSummary: this.form.proSummary,
                            // 项目类型
                            proTypeId: this.form.proTypeId
                        }
                        subObj = obj
                    } else {
                        // console.log('error submit!!')
                        return false
                    }
                })
                return subObj
            },
            jump(id) {
                this.$router.push('/projectEnd?id=' + this.id)
            },

          getMustFlag(domain,index){
            for(let data of this.dataList){
              if(data.dataId == domain.data){
                this.form.domains[index].isdata = data.mustFlag;
              }
            }

          },

        },

    }
</script>

<style lang="scss" scoped>
  .form {

    padding: 0% 20% 5% 0;
    background: #ffffff;
  }

  .selectNode {
    display: flex;

    .nodeItem {
      height: 30px;
      display: flex;
      justify-content: center;
      align-items: center;

      .itemText {
        height: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        margin-right: 15px;
        padding: 0 5px 0 5px;
        border: 1px solid black;
        border-radius: 1px;
        background: #ffffff;
      }

      .itemText:before {
        content: "";
        border: 14px solid black;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        width: 0px;
        height: 0px;
        position: absolute;
        right: -29px;
      }

      .itemText:after {
        content: "";
        border: 14px solid #ffffff;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        width: 0px;
        height: 0px;
        position: absolute;
        right: -28px;
      }

      .itemText_active {
        height: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        margin-right: 15px;
        padding: 0 5px 0 5px;
        border: 1px solid black;
        border-radius: 1px;
        background: #d7d7d7;
      }

      .itemText_active:before {
        content: "";
        border: 14px solid black;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        width: 0px;
        height: 0px;
        position: absolute;
        right: -29px;
      }

      .itemText_active:after {
        content: "";
        border: 14px solid #d7d7d7;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        width: 0px;
        height: 0px;
        position: absolute;
        right: -28px;
      }
    }
  }

  .line {
    text-align: center;
  }

  .core-form {
    // width: 80%;
    display: flex;
    // justify-content: space-between;
  }

  .datum {
    display: flex;
    justify-content: space-between;
  }

  .selectGroup {
    display: flex;
    justify-content: space-between;
  }

  .selectGroup .el-select {
    margin-right: 10px;
  }

  .deleteDelBtn {
    margin: 0px 10px;
  }

  .nodeCycleList {
    display: flex;
  }

  .nodeCycleItem {
    margin-top: 5px;
  }

  .searchResponsible {
    width: 30%;
  }

  .buttonBox {
    width: 100%;
    display: flex;
    justify-content: center;
  }
.radio{
  width:100px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
  &:hover{
    .radioPosition{
      visibility: visible;
    }
  }
}

  .radioPosition{
    position: absolute;
    left:0;
    bottom:25px;
    background: black;
    color: #fff;
    padding:10px;
    line-height: 18px;
    border-radius: 5px;
    max-width: 200px;
    white-space:normal;
    word-break:keep-all;
    word-wrap: break-word;

  }

</style>

<style lang="less" scoped>
    /deep/.el-textarea__inner{
        padding-right: 60px;
    }
    /deep/.el-select__tags{
        .el-tag--light{
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            word-break: break-all;
        }
    }

</style>
<style lang="less" scoped>
    .nodes{
        /deep/.el-form-item__label{
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
        }
    }
</style>

